<template>
	<view class="user clearfix  hv100 ">
		<cu-custom bgColor="bg-white" isBack>
			<block slot="content">
				<text v-if="iscollection">余额支付</text>
				<text v-else>余额收款</text>
			</block>
		</cu-custom>
		<view v-if="iscollection">
			<view class="paylines"></view>
			<view class="flex flex-direction bg-white px15">
				<view class="py10">余额支付</view>
				<view class="flex align-center justify-between py15">
					<text>余额</text>
					<text>{{money}}</text>
				</view>
				<view class="payline"></view>
				<view class="flex align-center justify-between py15">
					<text>对方手机号</text>
					<text>{{tel}}</text>
				</view>
				<view class="payline"></view>
				<view class="flex align-center justify-between py15">
					<text>手续费</text>
					<text>{{shouxufei}}%</text>
				</view>
				<view class="payline"></view>
				<view class="flex align-center justify-between py15">
					<text>实际到账</text>
					<text>{{shiMoney}}</text>
				</view>
				<view class="payline"></view>
				<view class="py10 mt15">支付密码</view>
				<input maxlength="6" v-model="paypwd" class="f14" password placeholder="请输入支付密码" />
				<view class="payline mt15"></view>
			</view>
			<view class="red-button discenter" @click="zhuanzhang">确认</view>
		</view>
		<view v-else>
			<view class="flex align-center  bg-white px15">
				<view class="py10">收款金额</view>
				<text class="fwb f26 ml20">￥{{shouMoney}}</text>
			</view>
			<view class="red-button discenter" @click="getSk">确认收款</view>
		</view>
	</view>
</template>

<script>
import { mapState, mapActions } from 'vuex'
export default {
	data() {
		return {
			money:'',
			tel:'',
			type:'',
			paypwd:'',
			shouxufei:'0',
			iscollection:true,
			//收款
			logId:'',
			shouMoney:''
		}
	},
	onLoad(e) {
		if(e.type==1){
			this.iscollection=true
			this.money=e.money
			this.tel=e.tel
			this.getData()
		}else{
			this.logId=e.logId
			this.shouMoney=e.money
			this.iscollection=false
		}
	},
	computed:{
		shiMoney(){
			if(this.money==''||this.money==0){
				return '0.00'
			}else{
				return (this.money*(1-this.shouxufei*0.01)).toFixed(4)
			}
		}
	},
	methods: {
		async getData() {
			let {
				data
			} = await this.$http.post('wallet.transferpage', {}, { tipConfig: { storeBlock: true } })
			this.shouxufei=data.sxf.desc
		},
		async getSk() {
			let {
				data
			} = await this.$http.post('wallet.paypagesure', {skId:this.logId},{custom: {tipConfig: { storeLoading: true, isSuccessTip: true}}})
			setTimeout(()=>{
				this.pushPage('/pages/usertransfer/skhistory')
			},800)
		},
		async zhuanzhang() {
			if(this.money==''||this.money==0){
				uni.showToast({
					title:'请输入转换数量',
					icon:"none"
				})
				return false
			}
			if(this.paypwd==''){
				uni.showToast({
					title:'请输入支付密码',
					icon:"none"
				})
				return false
			}
			let params={
				zzTel:this.tel,
				zzNum:this.money,
				payPassword:this.paypwd,
			}
			let {data} = await this.$http.post('wallet.transdersure', params, { tipConfig: { storeLoading: true, isSuccessTip: true, isSuccessBack: true, navigateBack: 1 } })
		},
	}
}
</script>

<style lang="less">
page{
	background-color: #FFFFFF;
}
.payline{
	width: 100%;
	height: 2rpx;
	background-color: #F2F2F2;
}
.paylines{
	width: 100%;
	height: 10rpx;
	background-color: #F2F2F2;
}
.red-button{
	width: calc(100% - 60rpx);
	margin-left: 30rpx;
	height: 90rpx;
	border-radius: 10rpx;
	background-color: #D73329;
	color: #FFFFFF;
	margin-top:80rpx ;
}
</style>
